﻿@using Microsoft.AspNetCore.Components
@inject HttpClient Http
@layout EmptyLayout
<div class="video-container">
    <!--
    <iframe
    src="@GetEmbedUrl()"
    frameborder="0"
    allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen>
    </iframe>
    -->
    <iframe width="1672" height="729" src="https://www.youtube.com/embed/U3aXWizDbQ4" title="C in 100 Seconds" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>

@code {
    [Parameter] public string VideoUrl { get; set; }
    [Parameter] public int Width { get; set; } = 800;
    [Parameter] public int Height { get; set; } = 450;


    private void OnParameterSet()
    {
    }

    private string GetEmbedUrl()
    {
        // 自动识别平台并转换为嵌入地址
        if (VideoUrl.Contains("v.qq.com"))
        {
            var vid = VideoUrl.Split('/').Last().Split('.').First();
            return $"https://v.qq.com/txp/iframe/player.html?vid={vid}";
        }
        if (VideoUrl.Contains("youtube.com"))
        {
            var videoId = VideoUrl.Split("v=").Last();
            return $"https://www.youtube.com/embed/{videoId}";
        }
        return VideoUrl; // 默认直接使用原始URL
    }
}

<style>
    .video-container {
        position: relative;
        padding-bottom: 56.25%; /* 16:9 比例 */
        height: 0;
        overflow: hidden;
        margin: 20px 0;
    }

        .video-container iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
</style>